<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="../debug/debug.js"></script>

<script>
	var debug;
	
	//클로저 활용
	// 자바스크립트에서 중첩된 함수는 그 함수 외부에서 정의된 변수를 사용할 수 있다. 
	
	function init() {
	  var name = "Mozilla";
	  function displayName() {
	    alert(name);
	  }
	  displayName();
	}
	init();
	
	// makeFunc는 함수 dispalyName을  리턴한다.
	function makeFunc() {
	  var name = "Mozilla";
	  function displayName() {
	    alert(name);
	  }
	  return displayName;
	}
	
	// myFunc 함수가 클로져(closure) 를 갖는다 ->makeFunc함수가 종료되어도 name지역변수가 남아있다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Closures
	var myFunc = makeFunc();
	myFunc();
		
		
	function addGenerator(num){
		return function(toAdd){
			return num+toAdd
		};
	}
	
	
	var makeCounter = function(){
		var privateCounter  = 0;
		function changeBy(num){
			privateCounter += num;
		}
		
		return {
			increment : function(){
				changeBy(1);
			},
			decrement : function(){
				changeBy(-1);
			},
			value : function(){
				return privateCounter;
			}
		}
	};
	
	window.onload=function(e){
		debug =  new DebugConsole();
		//클로저 addFive는 지역변수로 num에 5를 return function 환경을 갖는다.
		var addFive = addGenerator(5);   //addFive는 parameter를 받아서 5를  더해주는  함수가됨.
		//debug.displayMsg("addFile:"+addFive);
		debug.displayMsg(addFive(4));  //9
		
		var counter1= makeCounter();
		var counter2 = makeCounter();
		debug.displayMsg("counter1.value:"+counter1.value());
		counter1.increment();
		counter1.increment();
		debug.displayMsg("counter1.value:"+counter1.value());
		debug.displayMsg("counter2.value:"+counter2.value());
		
	}
</script>
</head>
<body>

</body>
</html>